<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
</head>

<body>
    <div id="app">
        <!-- 循环普通数组 i是索引 如不需要就可以直接 item in list -->
        <p v-for="(item,i) in list">索引:{{i}} ---- 值:{{item}}</p>
        <!-- 遍历对象数组 -->
        <p v-for="(user,i) in users">id:{{user.id}} --- name:{{user.name}}---索引:{{i}}</p>
        <!-- 循环对象 -->
        <p v-for="(val,key,index) in obj">{{index}}--{{key}}--{{val}}</p>
        <!-- 迭代数字 从1开始 -->
        <p v-for="count in 5">这是第{{count}}个数字</p>
    </div>
    <script>
        var vm=new Vue({
           el:'#app',
           data:{
               list:[1,2,3,4,5,6],
               users:[
                   {
                       id:1,
                       name:'sky'
                   },
                   {
                       id:2,
                       name:'cm'
                   },
                   {
                       id:3,
                       name:'jin'
                   }
               ],
               obj:{
                   id:1,
                   name:'sky',
                   age:18,
                   gender:'man'
               }
           },
           methods:{}
        });
    </script>
</body>

</html>